<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>日志</title>
  <link rel="stylesheet" type="text/css" href="../Styles/bootstrap-3.3.7-dist/css/bootstrap.min.css" />
<script type="text/javascript" src="../Scripts/jquery.min.js"></script>
<script type="text/javascript" src="../Styles/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<script type="text/javascript" src="../Styles/laypage/laypage.js"></script>
<script type="text/javascript" src="../Scripts/vue.min.js"></script>
    <style>
        h2{
            padding-left: 7%;
        }
        .main{
            width: 60%;
            margin-left: 10%;
        }
        .s1{
            margin-top: 8px;
        }
        #addfile{
            float: right;
        }
    </style>
</head>
<body>
<div>
    <h2>文件管理</h2>
   <div class="main">
       <ul id="myTab" class="nav nav-tabs">
           <li class="active">
               <a href="#sendMail" data-toggle="tab">
                   公司文件
               </a>
           </li>
           <li>
               <a href="#ios" data-toggle="tab">
                   个人文件
               </a>
           </li>

       </ul>
       <div id="myTabContent" class="tab-content">
           <div class="tab-pane fade in active table-responsive" id="sendMail">
               <table class="table table-bordered" id="publigFile">
                  <tr class="info">
                     <th>序列</th>
                     <th>文件名</th>
                     <th>上传时间</th>
                     <th>上传者</th>
                     <th>类型</th>
                     <th>操作</th>
                  </tr>
                  <tr v-for="publicFile in publicFileList" class="success">
                     <td>{{$index+1}}</td>
                     <td>{{publicFile.name}}</td>
                     <td>{{publicFile.stime}}</td>
                     <td>{{publicFile.uname}}</td>
                     <template v-if="publicFile.deptno!=20">
                       <td>部门</td>
                     </template>               
                     <template v-else>
                       <td>公司</td>
                     </template> 
                     <td><button type="button" class="btn btn-default btn-xs downFile" v-bind:value=publicFile.name>下载</button></td>
                  </tr>
               </table>
           </div>
           <div class="tab-pane fade" id="ios">
              <div class="s1" id="s1">
                <form id ="form">
                      <input type="file" style="display: none" id="file" name="file">
                </form>
                  <table class="table table-bordered" id="my-diary">
                      <tr class="success">
                          <td colspan="3">文件列表
                            
                              <span class="glyphicon glyphicon-plus" id="addfile">新增文件</span>
                          </td>
                      </tr>
                      <tr class="info">
                          <th>名称</th>
                          <th>上传时间</th>
                          <th>操作</th>
                      </tr>
                      <tr v-for="file in fileList">
                         <td>{{file.fileName}}</td>
                         <td>{{file.stime}}</td>
                         <td>
                         <button type="button" class="btn btn-default btn-xs down" v-bind:value=file.fileName>下载</button>
                         <button type="button" class="btn btn-default btn-xs move" v-bind:value=file.fid>删除</button>
                         </td>
                      </tr>
                  </table>
              </div>
           </div>
       </div>
   </div>
</div>
<script type="text/javascript">
  $(function(){
	  $("#addfile").click(function(){
		$("#file").trigger("click");
			 
	 })
	 $(document).on("change", "#file", function(){
		 $.ajax({
			 url:'../addMyFile',
			 type:'post',
			 data:new FormData($('#form')[0]),
			 processData:false,
			 contentType:false,
			 dataType:'json',
			 success : function(result){
				 console.log(result);
				 if(result==true){
					 alert("新增文件成功");
					 vue.getMyFileList();
				 }
			 }
			 
		 })
	 })
	 var vue = new Vue({
		 el:'#s1',
		 data:{fileList:""},
		 methods : {
			 getMyFileList : function(){
				 var _self = this;
				 $.ajax({
					 url:'../getMyFileList',
					 type:'post',
					 dataType:'json',
					 success : function(result){
						 _self.fileList = result;
					 }
				 })
			 }
		 }
	 })
	  vue.getMyFileList();
	  
	  $(".main").on('click','.down',function(){
		  var fileName = $(this).val();
		  console.log(fileName);
		  window.location.href="../downMyFile?fileName="+fileName;		
	  })
	  
	  $(".main").on('click','.move',function(){
		  var fid = $(this).val();
		  console.log(fid);
		  var fileName = $(this).siblings("button").val();
		  console.log(fileName);
		  if(confirm("确认删除")){
			  $.ajax({
				  url:'../deleteMyFile',
				  type:'post',
				  data:{'fid':fid,'fileName':fileName},
				  dataType:'json',
				  success:function(result){
					  if(result==true){
						  alert("删除成功");
						  vue.getMyFileList();
					  }
				  }
			  })
			 } 
	  })
	  
	  var vue2 = new Vue({
		  el:"#publigFile",
		  data:{publicFileList:""},
		  methods:{
			  getPublicFileList:function(){
				  var _self = this;
				  $.ajax({
					  url:'../getPublicList',
					  type:'post',
					  dataType:'json',
					  success : function(result){
						  console.log(result);
						  _self.publicFileList = result;
					  }
				  })
			  }
		  }
	  })
	  vue2.getPublicFileList();
	  
	  $("#publigFile").on('click','.downFile',function(){		  
		  var name =$(this).val();
		  console.log(name);
		  window.location.href="../downPublicFile?fileName="+name; 
	  })

	  
  })
</script>
</body>
</html>